<%@page import="hyl.ext.base.TokenFactory,hyl.ext.base.MyToken"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">

<meta
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
	name="viewport" />
<!-- 全局变量 函数定义区 见top.jsp -->
<%@ include file="pub/top1.jsp"%>
<title><%=SYSTEMNAME%></title>
<!-- 实例变量 函数定义区 -->
<%
//网页title String JSPTITLE="登录" ;
%>



<!--图标库-->
<link rel="stylesheet" href="<%=basePath%>cssjs/element/element.css">
<link rel="stylesheet" href="<%=basePath%>cssjs/login/login.css">
<script src="<%=basePath%>cssjs/vue/vue.min.js"></script>
<script src="<%=basePath%>cssjs/element/element2.13.js"></script>
<script src="<%=basePath%>cssjs/hyl/core/safe/md5.js"></script>
<style>
@media ( max-width : 600px) {
	.content {
		width: 80%;
	}
}

@media ( min-width : 600px) {
	.content {
		width: 500px;
	}
}

body {
	height: 100vh;
	/* 设置body的高度为视口高度 */
}

#app {
	width: 100%;
	height: 100%;
	display: flex;
	/* 将div对象设置为弹性盒子 */
	justify-content: center;
	/* 将div对象内部内容水平居中 */
	align-items: center;
	/* 将div对象内部内容垂直居中 */
}

.content {
	height: 340px;
	box-sizing: border-box;
	padding: 0 50px;
	border-radius: 5px;
	box-shadow: 0px 2px 12px 0px rgba(105, 105, 105, 0.07);
	background: rgba(255, 255, 255, 0.5);
	display: -webkit-flex;
	/* Safari */
	display: flex;
	justify-content: flex-end;
	flex-direction: column;
	/* 将body的子元素沿垂直方向排列 */
	animation: mymove 1s ease-in-out alternate;
	overflow: hidden;
	transition: 1s;
}

.content_input {
	/* padding-top: 20px;*/
	width: 80% px;
	height: 280px;
}

.line {
	display: -webkit-flex;
	/* Safari */
	display: flex;
	justify-content: space-between;
	/* 可选：flex-start, flex-end, center, space-between, space-around, space-evenly */
	/* 可选：start, end, flex-start, flex-end, center, baseline, stretch */
	width: 80% px;
	height: 30px;
}
</style>
</head>

<body>
	<div id="app">
		<div class="content">

			<div class="content_input">

				<div class="title">
					<p>管理员登录</p>
				</div>
				<el-input v-model="uname" clearable="" placeholder="用户名|手机|邮箱"></el-input>
				<el-input v-model="upass" clearable="" show-password=""
					placeholder="密码"></el-input>
				<div class="content_button">
					<el-button type="primary" @click="SignIn">登录</el-button>
				</div>


			</div>
			<div class="line">
				<el-link type="primary" href="https://element.eleme.io">注册会员</el-link>
				<el-link type="primary" href="https://element.eleme.io">忘记密码</el-link>
			</div>
		</div>

	</div>

	<!-- 先引入 Vue -->
	<!-- 引入组件库 -->



	<script type="module">
		import "<%=basePath%>cssjs/hyl/core/fun.js";
		import "<%=basePath%>cssjs/Mm.js"

		HYL_URLS.URL_DAO_PUBLICKEY = BASEPATH.concat("l/publickey");
		HYL_URLS.URL_DAO_KEY = BASEPATH.concat("l/sm4key");
		HYL_URLS.URL_DAO_LOGIN = BASEPATH.concat("l/login");
		var e能否提交 = false;

		new Vue({
			el: '#app',
			data() {
				return {
					uname: '123',
					upass: '123'
				}
			},
			methods: {
				SignIn() {
					if (!e能否提交) return;
					let that = this;
					if (HYL登录状态 == "1") {
						that.$message({
							message: '你已经登录了！',
							type: 'success'
						});
						window.location = HYL_URLS.URL_MAIN;
						return;
					}
					Mm.f登录(that.uname, that.upass,
						data => {						
						}, (e) => {
							that.$notify.error({
								title: '错误',
								message: e //,	position: 'top-left'
							});
						});
				}
			},
			created() {
				Mm.f准备(HYLSessionKey,HYL_URLS, () => {
					e能否提交 = true;
					console.log(Mm.readSM4())
				});
			},
			mounted() {
				console.log(`the component is now mounted.`)
			}
		});

	//	that.$message({
	//								message: '你已经登录了！',
	//								type: 'success'
	//							});
	</script>

	<script type="text/javascript" src="<%=basePath%>cssjs/ribbon.js"></script>

</body>

</html>




<!-- 扩展脚本 注入区 -->